<template id="num_signed">
  <div class="signed">


    <div class="row signedList">
      <div class="signedListInfo">
        <span class="col_333 ListInfoL">缴费编号</span>
        <span class="ListInfoR">{{numsigned.feeId}}</span>
      </div>
    </div>

    <div class="row signedList">
      <div class="signedListInfo">
        <span class="col_333 ListInfoL">缴费人员</span>
        <span class="ListInfoR">{{numsigned.feeUserName}}</span>
      </div>
    </div>
    <div class="row signedList">
      <div class="signedListInfo">
        <span class="col_333 ListInfoL">缴费单位</span>
        <span class="ListInfoR">{{numsigned.cropName}}</span>
      </div>
    </div>
    <div class="row signedList">
      <div class="signedListInfo">
        <span class="col_333 ListInfoL">联系方式</span>
        <span class="ListInfoR">{{numsigned.telNo}}</span>
      </div>
    </div>

    <div>
      <div v-if="numsigned.mDept.length">
        <div class="row signedList" v-for="(i, index) in numsigned.mDept" :key="i.deptId" >
          <div class="signedListInfo">
            <span class="col_333 ListInfoL">{{ index+1 | numToHan}}级机构</span>
            <span class="ListInfoR">{{i.deptName}}</span>
          </div>
        </div>
      </div>

      <div v-else>
        <div class="row signedList" >
          <div class="signedListInfo">
            <span class="col_333 ListInfoL">一级机构</span>
            <span class="ListInfoR">{{numsigned.deptName}}</span>
          </div>
        </div>
      </div>
    </div>

    <input type="button" @click="goConfirm(numsigned)" value="续约" class="signedBtn" style="background: #ff4444" v-if="numsigned.status ==0">
    <input type="button" @click="go_go_Confirm(numsigned)" value="确认" class="signedBtn" style="background: #ff4444" v-else-if="numsigned.status ==1">
    <input type="button" value="正在审核" class="signedBtn" v-else="">




  </div>
</template>

<script>

  import Vue from 'vue'

  import comJs from '../../js/common'
  import { MessageBox } from 'mint-ui';

  Vue.filter( 'numToHan' , function(value) {
    return comJs.convertToChinese(value) ;
  });

  export default {
    data(){
      return {
        numsigned: {}
        // numsignedParams: {}
      }
    },
    methods: {
      //是否续约
      goConfirm: function (item) {
        var that = this;
        MessageBox.confirm('确定续约操作?').then(function () {

          var params = {
            feeId: item.feeId,
            corpId: item.corpId,
            status: item.status,
            openAccount: sessionStorage.getItem('userId')
          };
          that.$post(that.$urlAll.extent_contract, params).then(function (response) {

            let instance = that.$toast('续约成功');
            setTimeout(function () {
              instance.close();
              that.$router.push({path:'/pay/paySign'})
            }, 2000)
          })
        }, function () {
          console.log('取消了');
        });
      },

      //是否确认
      go_go_Confirm: function (item) {
        var that = this;
        MessageBox.confirm('确定签约操作?').then(function () {

          var params = {

            openAccount: sessionStorage.getItem('userId'),
            feeUserId: item.feeUserId,
            corpId: item.corpId
          };
          that.$post(that.$urlAll.bind_apply, params).then(function (response) {

            let instance = that.$toast('签约成功');
            setTimeout(function () {
              instance.close();
              that.$router.push({path:'/pay/paySign'})
            }, 2000)
          })
        }, function () {
          console.log('取消了');
        });
      }

    },

    // computed: {
    //   numsigned: function () {
    //     return  this.$store.state.numsigned;
    //   }
    // },

    created: function(){
      // this.numsignedParams = this.$route.query;

      var that = this;

      console.log(that.$route.query);

      var options = {
        feeId: this.$route.query.feeId,
        corpId: this.$route.query.corpId,
        feeUserId: this.$route.query.feeUserId,
        openAccount: sessionStorage.getItem('userId')
      };

      //查询feeUser的公共接口
      this.$post(this.$urlAll.add_fee_user, options).then(function (response) {

        that.numsigned = response.t;

      });


      // console.log(this.numsigned);
    }
  }
</script>

<style scoped>
  @import "../../style/common.css";

  select{
    direction: rtl;
  }
  .signedList{
    height: 0.44rem;
    background-color: #fff;
    padding-left: 0.1rem;
  }
  .signedListInfo{
    border-bottom: 1px solid #eee;
    width: 100%;
    position: relative;
  }
  .signedList span{
    line-height: 0.44rem;
    font-size: 0.14rem;
  }
  .ListInfoR{
    padding-right: 0.1rem;
    font-size: 0.13rem;
    color: #666;
    position: absolute;
    right: 0px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);

  }
  .signedBtn{
    width: 2.93rem;
    height: 0.44rem;
    border: none;
    background-color: #999;
    font-size: 0.16rem;
    color: #fff;
    -webkit-border-radius: 0.05rem;
    -moz-border-radius: 0.05rem;
    border-radius: 0.05rem;
    outline: none;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    margin-top: 0.6rem;
  }
</style>











<!--<template id="num_signed">-->
  <!--<div class="signed">-->


    <!--<div class="row signedList">-->
      <!--<div class="signedListInfo">-->
        <!--<span class="col_333 ListInfoL">缴费编号</span>-->
        <!--<span class="ListInfoR">{{numsigned.feeId}}</span>-->
      <!--</div>-->
    <!--</div>-->

    <!--<div class="row signedList">-->
      <!--<div class="signedListInfo">-->
        <!--<span class="col_333 ListInfoL">缴费人员</span>-->
        <!--<span class="ListInfoR">{{numsigned.feeUserName}}</span>-->
      <!--</div>-->
    <!--</div>-->
    <!--<div class="row signedList">-->
      <!--<div class="signedListInfo">-->
        <!--<span class="col_333 ListInfoL">缴费单位</span>-->
        <!--<span class="ListInfoR">{{numsigned.cropName}}</span>-->
      <!--</div>-->
    <!--</div>-->
    <!--<div class="row signedList">-->
      <!--<div class="signedListInfo">-->
        <!--<span class="col_333 ListInfoL">联系方式</span>-->
        <!--<span class="ListInfoR">{{numsigned.telNo}}</span>-->
      <!--</div>-->
    <!--</div>-->

    <!--<div>-->
      <!--<div v-if="numsigned.mDept.length">-->
        <!--<div class="row signedList" v-for="(i, index) in numsigned.mDept" :key="i.deptId" >-->
          <!--<div class="signedListInfo">-->
            <!--<span class="col_333 ListInfoL">{{ index+1 | numToHan}}级机构</span>-->
            <!--<span class="ListInfoR">{{i.deptName}}</span>-->
          <!--</div>-->
        <!--</div>-->
      <!--</div>-->

      <!--<div v-else>-->
        <!--<div class="row signedList" >-->
          <!--<div class="signedListInfo">-->
            <!--<span class="col_333 ListInfoL">一级机构</span>-->
            <!--<span class="ListInfoR">{{numsigned.deptName}}</span>-->
          <!--</div>-->
        <!--</div>-->
      <!--</div>-->
    <!--</div>-->

    <!--<input type="button" @click="goConfirm(numsigned)" value="续约" class="signedBtn" style="background: #ff4444" v-if="numsigned.status ==0">-->
    <!--<input type="button" @click="go_go_Confirm(numsigned)" value="确认" class="signedBtn" style="background: #ff4444" v-else-if="numsigned.status ==1">-->
    <!--<input type="button" value="正在审核" class="signedBtn" v-else="">-->




  <!--</div>-->
<!--</template>-->

<!--<script>-->

  <!--import Vue from 'vue'-->

  <!--import comJs from '../../js/common'-->
  <!--import { MessageBox } from 'mint-ui';-->

  <!--Vue.filter( 'numToHan' , function(value) {-->
    <!--return comJs.convertToChinese(value) ;-->
  <!--});-->

  <!--export default {-->
    <!--data(){-->
      <!--return {-->
        <!--numsigned: {}-->
        <!--// numsignedParams: {}-->
      <!--}-->
    <!--},-->
    <!--methods: {-->
      <!--//是否续约-->
      <!--goConfirm: function (item) {-->
        <!--var that = this;-->
        <!--MessageBox.confirm('确定续约操作?').then(function () {-->

          <!--var params = {-->
            <!--feeId: item.feeId,-->
            <!--corpId: item.corpId,-->
            <!--status: item.status,-->
            <!--openAccount: sessionStorage.getItem('userId')-->
          <!--};-->
          <!--that.$post(that.$urlAll.extent_contract, params).then(function (response) {-->

            <!--let instance = that.$toast('续约成功');-->
            <!--setTimeout(function () {-->
              <!--instance.close();-->
              <!--that.$router.push({path:'/pay/paySign'})-->
            <!--}, 2000)-->
          <!--})-->
        <!--}, function () {-->
          <!--console.log('取消了');-->
        <!--});-->
      <!--},-->

      <!--//是否确认-->
      <!--go_go_Confirm: function (item) {-->
        <!--var that = this;-->
        <!--MessageBox.confirm('确定签约操作?').then(function () {-->

          <!--var params = {-->

            <!--openAccount: sessionStorage.getItem('userId'),-->
            <!--feeUserId: item.feeUserId,-->
            <!--corpId: item.corpId-->
          <!--};-->
          <!--that.$post(that.$urlAll.bind_apply, params).then(function (response) {-->

            <!--let instance = that.$toast('签约成功');-->
            <!--setTimeout(function () {-->
              <!--instance.close();-->
              <!--that.$router.push({path:'/pay/paySign'})-->
            <!--}, 2000)-->
          <!--})-->
        <!--}, function () {-->
          <!--console.log('取消了');-->
        <!--});-->
      <!--}-->

    <!--},-->

    <!--// computed: {-->
    <!--//   numsigned: function () {-->
    <!--//     return  this.$store.state.numsigned;-->
    <!--//   }-->
    <!--// },-->

    <!--created: function(){-->
      <!--// this.numsignedParams = this.$route.query;-->

      <!--var that = this;-->

      <!--var options = {-->
        <!--feeId: this.$route.query.feeId,-->
        <!--corpId: this.$route.query.corpId,-->
        <!--feeUserId: this.$route.query.feeUserId,-->
        <!--openAccount: sessionStorage.getItem('userId')-->
      <!--};-->

      <!--//查询feeUser的公共接口-->
      <!--this.$post(this.$urlAll.fee_user_and_dept, options).then(function (response) {-->

        <!--that.numsigned = response.t;-->

      <!--});-->


      <!--// console.log(this.numsigned);-->
    <!--}-->
  <!--}-->
<!--</script>-->

<!--<style scoped>-->
  <!--@import "../../style/common.css";-->

  <!--select{-->
    <!--direction: rtl;-->
  <!--}-->
  <!--.signedList{-->
    <!--height: 0.44rem;-->
    <!--background-color: #fff;-->
    <!--padding-left: 0.1rem;-->
  <!--}-->
  <!--.signedListInfo{-->
    <!--border-bottom: 1px solid #eee;-->
    <!--width: 100%;-->
    <!--position: relative;-->
  <!--}-->
  <!--.signedList span{-->
    <!--line-height: 0.44rem;-->
    <!--font-size: 0.14rem;-->
  <!--}-->
  <!--.ListInfoR{-->
    <!--padding-right: 0.1rem;-->
    <!--font-size: 0.13rem;-->
    <!--color: #666;-->
    <!--position: absolute;-->
    <!--right: 0px;-->
    <!--top: 50%;-->
    <!-- -webkit-transform: translateY(-50%);-->
    <!-- -moz-transform: translateY(-50%);-->
    <!-- -ms-transform: translateY(-50%);-->
    <!-- -o-transform: translateY(-50%);-->
    <!--transform: translateY(-50%);-->

  <!--}-->
  <!--.signedBtn{-->
    <!--width: 2.93rem;-->
    <!--height: 0.44rem;-->
    <!--border: none;-->
    <!--background-color: #999;-->
    <!--font-size: 0.16rem;-->
    <!--color: #fff;-->
    <!-- -webkit-border-radius: 0.05rem;-->
    <!-- -moz-border-radius: 0.05rem;-->
    <!--border-radius: 0.05rem;-->
    <!--outline: none;-->
    <!--position: absolute;-->
    <!--left: 50%;-->
    <!-- -webkit-transform: translateX(-50%);-->
    <!-- -moz-transform: translateX(-50%);-->
    <!-- -ms-transform: translateX(-50%);-->
    <!-- -o-transform: translateX(-50%);-->
    <!--transform: translateX(-50%);-->
    <!--margin-top: 0.6rem;-->
  <!--}-->
<!--</style>-->

